<script src='../../../resources/testharness.js'></script>
<script src='../../../resources/testharnessreport.js'></script>
<div id="target1" style="touch-action:none; width: 200px; height: 50px;">Target1</div>
<div id="target2" style="touch-action:none; width: 200px; height: 50px;">Target2</div>
<div id="description">Test user gesture behavior during multi-finger touch events.</div>
<div id="console"></div>

<script>

var target1 = document.getElementById('target1');
var rect1 = target1.getBoundingClientRect();
var targetX1 = rect1.left + rect1.width / 2;
var targetY1 = rect1.top + rect1.height / 2;

var target2 = document.getElementById('target2');
var rect2 = target2.getBoundingClientRect();
var targetX2 = rect2.left + rect2.width / 2;
var targetY2 = rect2.top + rect2.height / 2;

var receivedEvents = [];

['touchstart', 'touchmove', 'touchend'].forEach( eventName => {
  [target1, target2].forEach(t => {
    t.addEventListener(eventName, event => {
      var w = window.open("about:blank", "_blank");
      var openedPopup = undefined;
      if (w) {
        w.close();
        openedPopup = true;
      } else {
        openedPopup = false;
      }
      receivedEvents.push(event.type + '@' + event.target.id + '(' + openedPopup + ')');
    });
  });
});

var testUserGesture = async_test('Test user gesture behavior during multi-finger touch events.');

function callback() {
  testUserGesture.step(function () {
    assert_equals(receivedEvents.join(', '), "touchstart@target1(false), touchstart@target2(false), touchmove@target1(false), touchmove@target2(false), touchend@target1(true), touchend@target2(true)");
  });
  testUserGesture.done();
}

if (window.chrome && chrome.gpuBenchmarking && window.testRunner) {
  var pointerActions =
    [
    {source: "touch",
      actions: [
      { name: "pointerDown", x: targetX1, y: targetY1 },
      { name: "pointerMove", x: targetX1+30, y: targetY1 },
      { name: "pointerUp" }]},
    {source: "touch",
      actions: [
      { name: "pointerDown", x: targetX2, y: targetY2 },
      { name: "pointerMove", x: targetX2+30, y: targetY2 },
      { name: "pointerUp" }]}
    ];
  chrome.gpuBenchmarking.pointerActionSequence(pointerActions, callback);
}

</script>
